import { reactive, onMounted, onBeforeUnmount, getCurrentInstance } from 'vue';
import page from './page.ts';
export function useListComponent() {
  const { proxy } = getCurrentInstance() as any;
  //页面信息
  const dataInfo: any = reactive({
    loading: false, //加载
    loadingMsg: '列表数据加载中', //加载
    table: {
      title: page.title, //表格-标题
      //表格-内容数据
      tbody: [],
      rowKey: '',
      theadCode: '', //basedatatable
      //表格-表头数据
      thead: [
        {
          label: '订单日期',
          prop: 'orderDate',
          align: 'center', // 默认居中对齐，但原始数据中指定了isFloat为true，可能需要左对齐
          width: 120,
          fixed: true,
          // isCanSearch: true,
        },
        {
          label: '协议书号',
          prop: 'agreementNo',
          align: 'center', // 默认居中对齐，但原始数据中指定了isFloat为true，可能需要左对齐
          width: 128,
          fixed: true,
        },
        {
          label: '产品名称',
          prop: 'productName',
          align: 'left',
          width: 220,
          fixed: true,
        },
        {
          label: '生产单号',
          prop: 'produceBillNo',
          align: 'left',
          width: 160,
        },
        {
          label: '产品数量',
          prop: 'productQuantity',
          align: 'center',
          width: 80,
        },
        {
          label: '单位',
          prop: 'unit',
          align: 'center',
          width: 80,
        },
        {
          label: '材料1',
          prop: '',
          align: 'center',
          width: null,
          children: [
            {
              label: '名称',
              prop: 'material1Name',
              align: 'left',
              width: 160,
            },
            {
              label: '型号',
              prop: 'material1Specification',
              align: 'left',
              width: 100,
            },
            {
              label: '数量',
              prop: 'material1Quantity',
              align: 'center',
              width: 80,
            },
          ],
        },
        {
          label: '材料2',
          prop: '',
          align: 'center',
          width: null,
          children: [
            {
              label: '名称',
              prop: 'material2Name',
              align: 'left',
              width: 160,
            },
            {
              label: '型号',
              prop: 'material2Specification',
              align: 'left',
              width: 100,
            },
            {
              label: '数量',
              prop: 'material2Quantity',
              align: 'center',
              width: 80,
            },
          ],
        },
        {
          label: '材料3',
          prop: '',
          align: 'center',
          width: null,
          children: [
            {
              label: '名称',
              prop: 'material3Name',
              align: 'left',
              width: 160,
            },
            {
              label: '型号',
              prop: 'material3Specification',
              align: 'left',
              width: 100,
            },
            {
              label: '数量',
              prop: 'material3Quantity',
              align: 'center',
              width: 80,
            },
          ],
        },
        {
          label: '材料4',
          prop: '',
          align: 'center',
          width: null,
          children: [
            {
              label: '名称',
              prop: 'material4Name',
              align: 'left',
              width: 160,
            },
            {
              label: '型号',
              prop: 'material4Specification',
              align: 'left',
              width: 100,
            },
            {
              label: '数量',
              prop: 'material4Quantity',
              align: 'center',
              width: 80,
            },
          ],
        },
      ],
      //表格-搜索数据
      search: {
        pageIndex: 1, //当前页码
        pageSize: 30, //每页显示数据的数量
        totalCount: 0, //总数量
        queryDataBaseFiled: '', // 关键字查询字段，空值查询全部
        likeWords: '', // 查询关键字，空值查询全部
        startOrderDate: proxy.$getTimeAgo(1, 'months'), // 日期范围-开始时间
        endOrderDate: proxy.$day(new Date()), // 日期范围-结束时间
        agreementNo: '', // 协议书号
        produceBillNo: '', // 生产单号
        productName: '', // 产品名称
      },
      summary: [],
      //多选
      checkbox: {
        state: true,
        selectable: (row?: any) => {
          return true;
        },
        list: [],
      },
      //表格-按钮数据
      btns: [
        {
          title: '导出数据',
          icon: 'Download',
          type: '',
          children: [
            {
              title: '导出当页数据',
              click: () => {
                setLoading('导出当页数据,请稍等');
                exportBtn(dataInfo.table.tbody);
              },
            },
            {
              title: '导出全部数据',
              click: () => {
                setLoading('正在导出全部数据,请稍等');
                proxy.$api.Report.PageQueryProductionOrderMaterialMachineReport({
                  ...dataInfo.table.search,
                  pageIndex: 1,
                  pageSize: 10000,
                  startOrderDate: dataInfo.table.search.beginTime || proxy.$getTimeAgo(1, 'years'), // 开始时间
                  endOrderDate: dataInfo.table.search.endTime || proxy.$day(new Date()), // 结束时间
                })
                  .then((res: any) => {
                    exportBtn(res.list);
                  })
                  .catch(() => {
                    dataInfo.loading = false;
                  });
              },
            },
            {
              title: '导出选中数据',
              click: () => {
                setLoading('导出选中数据,请稍等');
                exportBtn(dataInfo.table.checkbox.list);
              },
            },
          ],
        },
      ],
    },
  });
  const options = reactive({
    goodsCategory: [],
    device: [],
  });
  // 获取表数据
  const getTbody = () => {
    let _table: any = dataInfo.table;
    let _thead: any = dataInfo.table.thead;
    setLoading();
    if (options.device.length === 0) {
      proxy.$api.ProduceMachine.GetProduceMachinesEquipmentsByMachineCode({
        equipmentState: 1, // 机台状态：1可用；0禁用，-1查询全部
        likeWords: '', // 查询关键字，空值查询全部
        machineCode: '', // 设备code
      }).then((res: any) => {
        let deviceThead: any = {
          label: '设备工时(分钟)',
          prop: '',
          align: 'center',
          width: null,
          children: [],
        };
        options.device = res.map((el: any) => {
          deviceThead.children.push({
            label: el.equipmentName,
            prop: el.equipmentCode,
            align: 'center',
            width: 120,
            isSummary: true,
          });
          dataInfo.table.summary.push({
            label: el.equipmentName,
            value: el.equipmentCode,
          });
          return {
            ...el,
            label: el.equipmentName,
            value: el.equipmentCode,
          };
        });
        _thead.push(deviceThead);
        setTbody();
      });
    } else {
      setTbody();
    }

    function setTbody() {
      proxy.$api.Report.PageQueryProductionOrderMaterialMachineReport(_table.search)
        .then((res: any) => {
          const devicesId = options.device.map((el: any) => el.equipmentCode);
          _table.tbody = res.list.map((el: any) => {
            for (let keyIndex in devicesId) {
              el[devicesId[keyIndex]] = 0;
            }
            if (el.devices?.length > 0) {
              el.devices.forEach((devices: any) => {
                el[devices.deviceCode] = devices.deviceWork || 0;
              });
            }
            return el;
          });
          _table.search.totalCount = res.totalCount;
          dataInfo.loading = false;
        })
        .catch(() => {
          dataInfo.loading = false;
        });
    }
  };
  // 导出数据
  const exportBtn = (tbody: any[]) => {
    proxy.$exportData(
      {
        thead: dataInfo.table.thead,
        tbody: tbody,
        fileName: dataInfo.table.title,
      },
      dataInfo,
    );
    dataInfo.loading = false;
  };
  const setLoading = (title: string = '正在获取数据,请稍等...') => {
    if (!dataInfo.loading) {
      dataInfo.loading = true;
      dataInfo.loadingMsg = title;
    }
  };
  // 组件挂载后执行
  onMounted(async () => {
    getTbody();
  });
  // 组件卸载前执行
  onBeforeUnmount(() => {});
  return { dataInfo, getTbody, options };
}
